JavaScript-ன் முன்மாதிரி சங்கிலியை வெளிப்படுத்துதல்: மரபுரிமை முறைகள் மற்றும் பொருள் உருவாக்கம்

JavaScript, அதன் மையத்தில், பல தசாப்தங்களாக இணையத்தை இயக்கியுள்ள ஒரு மாறும் மற்றும் பல்துறை மொழியாகும். ECMAScript 6 (ES6) மற்றும் அதற்குப் பிந்தையவற்றில் அறிமுகப்படுத்தப்பட்ட அதன் செயல்பாட்டு அம்சங்கள் மற்றும் நவீன தொடரியல் பற்றி பலர் அறிந்திருந்தாலும், மொழியை உண்மையில் தேர்ச்சி பெற அதன் அடிப்படையிலான வழிமுறைகளைப் புரிந்துகொள்வது அவசியம். மிகவும் அடிப்படையான, ஆனால் பெரும்பாலும் தவறாகப் புரிந்துகொள்ளப்படும் கருத்துக்களில் ஒன்று முன்மாதிரி சங்கிலி ஆகும். இந்தப் பதிவு முன்மாதிரி சங்கிலியைப் பற்றி விளக்குகிறது, இது பொருள் உருவாக்கத்தை எவ்வாறு எளிதாக்குகிறது மற்றும் பல்வேறு மரபுரிமை முறைகளை இயக்குகிறது, உலகெங்கிலும் உள்ள டெவலப்பர்களுக்கு ஒரு உலகளாவிய கண்ணோட்டத்தை வழங்குகிறது.

அடித்தளம்: JavaScript-ல் பொருள்கள் மற்றும் பண்புகள்

முன்மாதிரி சங்கிலியில் நுழைவதற்கு முன், JavaScript-ல் பொருள்கள் எவ்வாறு செயல்படுகின்றன என்பது பற்றிய அடிப்படை புரிதலை ஏற்படுத்துவோம். JavaScript-ல், கிட்டத்தட்ட எல்லாம் ஒரு பொருள். பொருள்கள் முக்கிய-மதிப்பு ஜோடிகளின் தொகுப்பாகும், அங்கு முக்கியமானது சொத்து பெயர்களாகும் (பொதுவாக சரங்கள் அல்லது சின்னங்கள்) மற்றும் மதிப்புகள் மற்ற பொருள்கள், செயல்பாடுகள் அல்லது அடிப்படை மதிப்புகள் உட்பட எந்த தரவு வகையாகவும் இருக்கலாம்.

ஒரு எளிய பொருளைக் கவனியுங்கள்:

            const person = {
  name: "Alice",
  age: 30,
  greet: function() {
    console.log(`Hello, my name is ${this.name}.`);
  }
};

console.log(person.name); // Output: Alice
person.greet();        // Output: Hello, my name is Alice.

            

              
                Copy
              
            
          

person.name போன்ற ஒரு பொருளின் சொத்தை நீங்கள் அணுகும்போது, JavaScript முதலில் அந்த சொத்தை பொருளில் நேரடியாகத் தேடுகிறது. அது கிடைக்கவில்லை என்றால், அது அங்கேயே நிற்காது. இங்குதான் முன்மாதிரி சங்கிலி விளையாட வருகிறது.

ஒரு முன்மாதிரி என்றால் என்ன?

ஒவ்வொரு JavaScript பொருளும் [[Prototype]] என்று அடிக்கடி குறிப்பிடப்படும் ஒரு உள் சொத்தைக் கொண்டுள்ளது, இது மற்றொரு பொருளைக் குறிக்கிறது. இந்த மற்றொரு பொருள் அசல் பொருளின் முன்மாதிரி என்று அழைக்கப்படுகிறது. ஒரு பொருளில் ஒரு சொத்தை அணுக முயற்சிக்கும்போது, அந்த சொத்து பொருளில் நேரடியாகக் கண்டுபிடிக்கப்படவில்லை என்றால், JavaScript அந்த பொருளின் முன்மாதிரியில் தேடுகிறது. அங்கு அது கண்டுபிடிக்கப்படவில்லை என்றால், அது முன்மாதிரியின் முன்மாதிரியைப் பார்க்கிறது, மேலும் ஒரு சங்கிலியை உருவாக்குகிறது.

இந்த சங்கிலி JavaScript சொத்தை கண்டுபிடிக்கும் வரை அல்லது சங்கிலியின் முடிவை அடையும் வரை தொடர்கிறது, இது பொதுவாக Object.prototype ஆகும், இதன் [[Prototype]] null ஆகும். இந்த வழிமுறை முன்மாதிரி மரபுரிமை என்று அழைக்கப்படுகிறது.

முன்மாதிரியை அணுகுதல்

[[Prototype]] என்பது ஒரு உள் ஸ்லாட் என்றாலும், ஒரு பொருளின் முன்மாதிரியுடன் தொடர்பு கொள்ள இரண்டு முக்கிய வழிகள் உள்ளன:

• Object.getPrototypeOf(obj): ஒரு பொருளின் முன்மாதிரியைப் பெறுவதற்கான தரநிலையான மற்றும் பரிந்துரைக்கப்பட்ட வழி இது.
• obj.__proto__: இது ஒரு வழக்கற்றுப் போனது, ஆனால் பரவலாக ஆதரிக்கப்படும் தரமற்ற சொத்து, இது முன்மாதிரியையும் வழங்குகிறது. சிறந்த இணக்கத்தன்மை மற்றும் தரங்களுக்கு இணங்குவதற்கு Object.getPrototypeOf() ஐப் பயன்படுத்துவது பொதுவாக அறிவுறுத்தப்படுகிறது.

const person = {
  name: "Alice"
};

const personPrototype = Object.getPrototypeOf(person);
console.log(personPrototype === Object.prototype); // Output: true

// Using the deprecated __proto__
console.log(person.__proto__ === Object.prototype); // Output: true

செயலில் உள்ள முன்மாதிரி சங்கிலி

முன்மாதிரி சங்கிலி அடிப்படையில் பொருள்களின் ஒரு இணைக்கப்பட்ட பட்டியல் ஆகும். நீங்கள் ஒரு சொத்தை அணுக முயற்சிக்கும்போது (பெறுதல், அமைத்தல் அல்லது நீக்குதல்), JavaScript இந்த சங்கிலியை கடந்து செல்கிறது:

1. JavaScript சொத்து பொருளில் நேரடியாக உள்ளதா என சரிபார்க்கிறது.
2. கண்டுபிடிக்கப்படவில்லை என்றால், அது பொருளின் முன்மாதிரியை (obj.[[Prototype]]) சரிபார்க்கிறது.
3. இன்னும் கண்டுபிடிக்கப்படவில்லை என்றால், அது முன்மாதிரியின் முன்மாதிரியைச் சரிபார்க்கிறது, மேலும் பல.
4. சொத்து கண்டுபிடிக்கப்படும் வரை அல்லது சங்கிலி null ஆக இருக்கும் ஒரு பொருளில் (பொதுவாக Object.prototype) முடிகிறது.

உதாரணமாக விளக்குவோம். எங்களிடம் ஒரு அடிப்படை `Animal` கட்டமைப்புச் செயல்பாடு உள்ளது, பின்னர் `Dog` கட்டமைப்புச் செயல்பாடு உள்ளது, இது `Animal`-லிருந்து பெறப்படுகிறது.

// Constructor function for Animal
function Animal(name) {
  this.name = name;
}

Animal.prototype.speak = function() {
  console.log(`${this.name} makes a sound.`);
};

// Constructor function for Dog
function Dog(name, breed) {
  Animal.call(this, name); // Call the parent constructor
  this.breed = breed;
}

// Setting up the prototype chain: Dog.prototype inherits from Animal.prototype
Dog.prototype = Object.create(Animal.prototype);
Dog.prototype.constructor = Dog; // Correct the constructor property

Dog.prototype.bark = function() {
  console.log(`Woof! My name is ${this.name} and I'm a ${this.breed}.`);
};

const myDog = new Dog("Buddy", "Golden Retriever");

console.log(myDog.name);     // Output: Buddy (found on myDog)
myDog.speak();    // Output: Buddy makes a sound. (found on Dog.prototype via Animal.prototype)
myDog.bark();     // Output: Woof! My name is Buddy and I'm a Golden Retriever. (found on Dog.prototype)

console.log(Object.getPrototypeOf(myDog) === Dog.prototype); // Output: true
console.log(Object.getPrototypeOf(Dog.prototype) === Animal.prototype); // Output: true
console.log(Object.getPrototypeOf(Animal.prototype) === Object.prototype); // Output: true
console.log(Object.getPrototypeOf(Object.prototype) === null); // Output: true

இந்த எடுத்துக்காட்டில்:

• myDog ஒரு நேரடி சொத்து name மற்றும் breed ஐக் கொண்டுள்ளது.
• myDog.speak() அழைக்கப்பட்டால், JavaScript myDog-ல் speak ஐத் தேடுகிறது. அது கண்டுபிடிக்கப்படவில்லை.
• பின்னர் அது Object.getPrototypeOf(myDog) ஐப் பார்க்கிறது, இது Dog.prototype ஆகும். அங்கு speak கண்டுபிடிக்கப்படவில்லை.
• பின்னர் அது Object.getPrototypeOf(Dog.prototype) ஐப் பார்க்கிறது, இது Animal.prototype ஆகும். இங்கே, speak கண்டுபிடிக்கப்பட்டது! செயல்பாடு செயல்படுத்தப்படுகிறது, மேலும் speak உள்ளே உள்ள this myDog ஐக் குறிக்கிறது.

பொருள் உருவாக்கும் முறைகள்

முன்மாதிரி சங்கிலி JavaScript-ல் பொருள்கள் எவ்வாறு உருவாக்கப்படுகின்றன என்பதற்கு உள்ளார்ந்த முறையில் இணைக்கப்பட்டுள்ளது. வரலாற்று ரீதியாக, ES6 வகுப்புகளுக்கு முன், பொருள் உருவாக்கம் மற்றும் மரபுரிமையை அடைய பல முறைகள் பயன்படுத்தப்பட்டன:

1. கட்டமைப்பு செயல்பாடுகள்

மேலே உள்ள Animal மற்றும் Dog உதாரணங்களில் காணப்படுவது போல, கட்டமைப்பு செயல்பாடுகள் பொருள்களை உருவாக்குவதற்கான ஒரு பாரம்பரிய வழியாகும். நீங்கள் ஒரு செயல்பாட்டுடன் new முக்கிய வார்த்தையைப் பயன்படுத்தும்போது, JavaScript பல செயல்களைச் செய்கிறது:

1. ஒரு புதிய வெற்று பொருள் உருவாக்கப்படுகிறது.
2. இந்த புதிய பொருள் கட்டமைப்பு செயல்பாட்டின் prototype சொத்துக்கு இணைக்கப்பட்டுள்ளது (அதாவது, newObj.[[Prototype]] = Constructor.prototype).
3. புதிய பொருளுடன் this உடன் இணைக்கப்பட்டு கட்டமைப்புச் செயல்பாடு அழைக்கப்படுகிறது.
4. கட்டமைப்பு செயல்பாடு ஒரு பொருளை வெளிப்படையாகத் திரும்பத் தரவில்லை என்றால், புதிதாக உருவாக்கப்பட்ட பொருள் (this) மறைமுகமாகத் திரும்பும்.

கட்டமைப்பாளரின் முன்மாதிரியில் வரையறுக்கப்பட்ட பகிரப்பட்ட முறைகளுடன் பொருள்களின் பல நிகழ்வுகளை உருவாக்குவதற்கு இந்த முறை சக்தி வாய்ந்தது.

2. தொழிற்சாலை செயல்பாடுகள்

தொழிற்சாலை செயல்பாடுகள் என்பது ஒரு பொருளை வழங்கும் செயல்பாடுகளாகும். அவை new முக்கிய வார்த்தையைப் பயன்படுத்துவதில்லை மற்றும் கட்டமைப்பு செயல்பாடுகளைப் போலவே முன்மாதிரியுடன் தானாகவே இணைக்கப்படுவதில்லை. இருப்பினும், திருப்பி அனுப்பப்பட்ட பொருளின் முன்மாதிரியை வெளிப்படையாக அமைப்பதன் மூலம் அவை இன்னும் முன்மாதிரிகளைப் பயன்படுத்தலாம்.

function createPerson(name, age) {
  const person = Object.create(personFactory.prototype);
  person.name = name;
  person.age = age;
  return person;
}

personFactory.prototype.greet = function() {
  console.log(`Hello, I'm ${this.name}`);
};

const john = createPerson("John", 25);
john.greet(); // Output: Hello, I'm John

இங்கே Object.create() என்பது ஒரு முக்கிய முறையாகும். இது ஒரு புதிய பொருளை உருவாக்குகிறது, ஏற்கனவே உள்ள ஒரு பொருளை புதிதாக உருவாக்கப்பட்ட பொருளின் முன்மாதிரியாக பயன்படுத்துகிறது. இது முன்மாதிரி சங்கிலியின் மீது வெளிப்படையான கட்டுப்பாட்டை அனுமதிக்கிறது.

3. `Object.create()`

மேலே குறிப்பிட்டபடி, Object.create(proto, [propertiesObject]) என்பது ஒரு குறிப்பிட்ட முன்மாதிரியுடன் பொருள்களை உருவாக்குவதற்கான ஒரு அடிப்படை கருவியாகும். இது கட்டமைப்பு செயல்பாடுகளை முழுமையாகத் தவிர்த்துவிட்டு ஒரு பொருளின் முன்மாதிரியை நேரடியாக அமைக்க உங்களை அனுமதிக்கிறது.

const personPrototype = {
  greet: function() {
    console.log(`Hello, my name is ${this.name}`);
  }
};

// Create a new object 'bob' with 'personPrototype' as its prototype
const bob = Object.create(personPrototype);
bob.name = "Bob";
bob.greet(); // Output: Hello, my name is Bob

// You can even pass properties as a second argument
const charles = Object.create(personPrototype, {
  name: { value: "Charles", writable: true, enumerable: true, configurable: true }
});
charles.greet(); // Output: Hello, my name is Charles

முன் வரையறுக்கப்பட்ட முன்மாதிரிகளுடன் பொருள்களை உருவாக்குவதற்கு இந்த முறை மிகவும் சக்தி வாய்ந்தது, நெகிழ்வான மரபுரிமை கட்டமைப்புகளை செயல்படுத்துகிறது.

ES6 வகுப்புகள்: தொடரியல் சர்க்கரை

ES6 இன் வருகையுடன், JavaScript class தொடரியலை அறிமுகப்படுத்தியது. JavaScript-ல் உள்ள வகுப்புகள் முதன்மையாக ஏற்கனவே உள்ள முன்மாதிரி மரபுரிமை வழிமுறையின் மீதுள்ள தொடரியல் சர்க்கரை என்பதைப் புரிந்து கொள்வது முக்கியம். அவை வகுப்பு அடிப்படையிலான பொருள் சார்ந்த மொழிகளிலிருந்து வரும் டெவலப்பர்களுக்கு மிகவும் சுத்தமான, நன்கு தெரிந்த தொடரியலை வழங்குகின்றன.

// Using ES6 class syntax
class AnimalES6 {
  constructor(name) {
    this.name = name;
  }

  speak() {
    console.log(`${this.name} makes a sound.`);
  }
}

class DogES6 extends AnimalES6 {
  constructor(name, breed) {
    super(name); // Calls the parent class constructor
    this.breed = breed;
  }

  bark() {
    console.log(`Woof! My name is ${this.name} and I'm a ${this.breed}.`);
  }
}

const myDogES6 = new DogES6("Rex", "German Shepherd");
myDogES6.speak(); // Output: Rex makes a sound.
myDogES6.bark();  // Output: Woof! My name is Rex and I'm a German Shepherd.

// Under the hood, this still uses prototypes:
console.log(Object.getPrototypeOf(myDogES6) === DogES6.prototype); // Output: true
console.log(Object.getPrototypeOf(DogES6.prototype) === AnimalES6.prototype); // Output: true

நீங்கள் ஒரு வகுப்பை வரையறுக்கும்போது, JavaScript அடிப்படையில் ஒரு கட்டமைப்பு செயல்பாட்டை உருவாக்கி, முன்மாதிரி சங்கிலியை தானாகவே அமைக்கிறது:

• constructor முறை பொருள் நிகழ்வின் பண்புகளை வரையறுக்கிறது.
• வகுப்பு உடலில் வரையறுக்கப்பட்ட முறைகள் (speak மற்றும் bark போன்றவை) தானாகவே அந்த வகுப்போடு தொடர்புடைய கட்டமைப்பு செயல்பாட்டின் prototype சொத்தில் வைக்கப்படுகின்றன.
• extends முக்கிய சொல் மரபுரிமை உறவை அமைக்கிறது, குழந்தை வகுப்பின் முன்மாதிரியை பெற்றோர் வகுப்பின் முன்மாதிரியுடன் இணைக்கிறது.

முன்மாதிரி சங்கிலி உலகளவில் ஏன் முக்கியமானது

முன்மாதிரி சங்கிலியைப் புரிந்துகொள்வது ஒரு கல்விப் பயிற்சி மட்டுமல்ல; இது வலுவான, திறமையான மற்றும் பராமரிக்கக்கூடிய JavaScript பயன்பாடுகளை உருவாக்குவதற்கு ஆழ்ந்த தாக்கங்களைக் கொண்டுள்ளது, குறிப்பாக உலகளாவிய சூழலில்:

• செயல்திறன் மேம்படுத்துதல்: முன்மாதிரியில் முறைகளை வரையறுப்பதன் மூலம், ஒவ்வொரு தனிப்பட்ட பொருள் நிகழ்விலும் அல்ல, நீங்கள் நினைவகத்தை சேமிக்கிறீர்கள். அனைத்து நிகழ்வுகளும் ஒரே முறையைப் பகிர்ந்து கொள்கின்றன, இது மிகவும் திறமையான நினைவக பயன்பாட்டிற்கு வழிவகுக்கிறது, இது உலகளவில் பரந்த அளவிலான சாதனங்கள் மற்றும் பிணைய நிலைகளில் பயன்படுத்தப்படும் பயன்பாடுகளுக்கு முக்கியமானதாகும்.
• கோட் மீண்டும் பயன்படுத்துதல்: கோட் மீண்டும் பயன்படுத்துவதற்கான JavaScript இன் முதன்மை வழிமுறை முன்மாதிரி சங்கிலியாகும். மரபுரிமை சிக்கலான பொருள் படிநிலைகளை உருவாக்க உங்களை அனுமதிக்கிறது, குறியீட்டை நகலெடுக்காமல் செயல்பாட்டை நீட்டிக்கிறது. சர்வதேச திட்டங்களில் பணிபுரியும் பெரிய, விநியோகிக்கப்பட்ட குழுக்களுக்கு இது விலைமதிப்பற்றது.
• ஆழமான பிழைத்திருத்தம்: பிழைகள் ஏற்படும்போது, முன்மாதிரி சங்கிலியைக் கண்டறிவது எதிர்பாராத நடத்தையின் மூலத்தைக் கண்டறிய உதவும். பண்புகள் எவ்வாறு பார்க்கப்படுகின்றன என்பதைப் புரிந்துகொள்வது மரபுரிமை, நோக்கம் மற்றும் `this` பிணைப்பு தொடர்பான சிக்கல்களைத் தீர்ப்பதற்கு முக்கியமாகும்.
• கட்டமைப்பு மற்றும் நூலகங்கள்: பல பிரபலமான JavaScript கட்டமைப்பு மற்றும் நூலகங்கள் (எ.கா., பழைய பதிப்பு React, Angular, Vue.js) முன்மாதிரி சங்கிலியைப் பெரிதும் நம்பியுள்ளன அல்லது அதனுடன் தொடர்பு கொள்கின்றன. முன்மாதிரிகளைப் பற்றிய ஒரு உறுதியான புரிதல் அவற்றின் உள் செயல்பாடுகளைப் புரிந்துகொள்ள உதவுகிறது மற்றும் அவற்றை மிகவும் திறம்படப் பயன்படுத்த உதவுகிறது.
• மொழி ஒருவருக்கொருவர் செயல்படுதல்: முன்மாதிரிகளுடன் JavaScript இன் நெகிழ்வுத்தன்மை பிற அமைப்புகள் அல்லது மொழிகளுடன் ஒருங்கிணைப்பதை எளிதாக்குகிறது, குறிப்பாக JavaScript சொந்த தொகுதிகளுடன் தொடர்பு கொள்ளும் Node.js போன்ற சூழல்களில்.
• கருத்தியல் தெளிவு: ES6 வகுப்புகள் சில சிக்கல்களைத் தவிர்த்துவிட்டாலும், முன்மாதிரிகளின் அடிப்படை புரிதல் என்ன நடக்கிறது என்பதைப் புரிந்து கொள்ள உங்களை அனுமதிக்கிறது. இது உங்கள் புரிதலை ஆழப்படுத்துகிறது மற்றும் உங்கள் புவியியல் இருப்பிடம் அல்லது விருப்பமான வளர்ச்சிச் சூழலைப் பொருட்படுத்தாமல் விளிம்பு வழக்குகள் மற்றும் மேம்பட்ட காட்சிகளை மிகவும் நம்பிக்கையுடன் கையாள உதவுகிறது.

பொதுவான குழிகள் மற்றும் சிறந்த நடைமுறைகள்

சக்தி வாய்ந்ததாக இருந்தாலும், கவனமாக கையாளாவிட்டால் முன்மாதிரி சங்கிலி குழப்பத்திற்கு வழிவகுக்கும். சில பொதுவான குழிகள் மற்றும் சிறந்த நடைமுறைகள் இங்கே:

குழி 1: உள்ளமைக்கப்பட்ட முன்மாதிரிகளை மாற்றுதல்

Array.prototype அல்லது Object.prototype போன்ற உள்ளமைக்கப்பட்ட பொருள் முன்மாதிரிகளில் முறைகளைச் சேர்ப்பது அல்லது மாற்றுவது பொதுவாக ஒரு மோசமான யோசனையாகும். இது பெயரிடும் மோதல்களுக்கும், பெரிய திட்டங்களில் அல்லது இந்த முன்மாதிரிகளின் அசல் நடத்தையைச் சார்ந்திருக்கக்கூடிய மூன்றாம் தரப்பு நூலகங்களைப் பயன்படுத்தும்போதும் கணிக்க முடியாத நடத்தைக்கு வழிவகுக்கும்.

சிறந்த பயிற்சி: உங்கள் சொந்த கட்டமைப்பு செயல்பாடுகள், தொழிற்சாலை செயல்பாடுகள் அல்லது ES6 வகுப்புகளைப் பயன்படுத்தவும். நீங்கள் செயல்பாட்டை நீட்டிக்க வேண்டும் என்றால், பயன்பாட்டு செயல்பாடுகளை உருவாக்குவது அல்லது தொகுதிகளைப் பயன்படுத்துவது குறித்து பரிசீலிக்கவும்.

குழி 2: தவறான கட்டமைப்பு சொத்து

மரபுரிமையை கைமுறையாக அமைக்கும்போது (எ.கா., Dog.prototype = Object.create(Animal.prototype)), புதிய முன்மாதிரியின் constructor சொத்து (Dog.prototype) அசல் கட்டமைப்புக்கு (Animal) சுட்டிக்காட்டும். இது `instanceof` சரிபார்ப்புகள் மற்றும் அகநோக்குதல் தொடர்பான சிக்கல்களை ஏற்படுத்தும்.

சிறந்த பயிற்சி: மரபுரிமையை அமைத்த பிறகு எப்போதும் constructor சொத்தை வெளிப்படையாக மீட்டமைக்கவும்:

Dog.prototype = Object.create(Animal.prototype);
Dog.prototype.constructor = Dog;

குழி 3: `this` சூழலைப் புரிந்துகொள்வது

முன்மாதிரி முறைகளில் this இன் நடத்தை முக்கியமானது. this எப்போதும் முறை அழைக்கப்படும் பொருளைக் குறிக்கிறது, முறை எங்கு வரையறுக்கப்படவில்லை. முன்மாதிரி சங்கிலியில் முறைகள் எவ்வாறு செயல்படுகின்றன என்பதற்கு இது அடிப்படையானது.

சிறந்த பயிற்சி: முறைகள் எவ்வாறு அழைக்கப்படுகின்றன என்பதை மனதில் வைத்துக் கொள்ளுங்கள். நீங்கள் குறிப்பாக `this` சூழலை அமைக்க வேண்டும் என்றால், `.call()`, `.apply()` அல்லது `.bind()` ஐப் பயன்படுத்தவும், குறிப்பாக முறைகளை அழைப்புகளாகக் கடத்தும் போது.

குழி 4: பிற மொழிகளில் உள்ள வகுப்புகளுடன் குழப்பம்

கிளாசிக்கல் மரபுரிமைக்கு (Java அல்லது C++ போன்ற) பழக்கப்பட்ட டெவலப்பர்கள் JavaScript இன் முன்மாதிரி மரபுரிமை மாதிரியை ஆரம்பத்தில் உள்ளுணர்வு இல்லாததாகக் காணலாம். ES6 வகுப்புகள் ஒரு முகப்பு என்பதை நினைவில் கொள்ளுங்கள்; அடிப்படை வழிமுறை இன்னும் முன்மாதிரிகளாகும்.

சிறந்த பயிற்சி: JavaScript இன் முன்மாதிரி தன்மையை ஏற்றுக்கொள்ளுங்கள். பொருள்கள் அவற்றின் முன்மாதிரிகள் மூலம் சொத்து தேடல்களை எவ்வாறு பிரதிபலிக்கின்றன என்பதைப் புரிந்துகொள்வதில் கவனம் செலுத்துங்கள்.

அடிப்படைக்கு அப்பால்: மேம்பட்ட கருத்துகள்

`instanceof` ஆபரேட்டர்

ஒரு பொருளின் முன்மாதிரி சங்கிலியில் ஒரு குறிப்பிட்ட கட்டமைப்புச் செயல்பாட்டின் prototype சொத்து உள்ளதா என instanceof ஆபரேட்டர் சரிபார்க்கிறது. இது ஒரு முன்மாதிரி அமைப்பில் வகை சரிபார்ப்பதற்கான ஒரு சக்திவாய்ந்த கருவியாகும்.

console.log(myDog instanceof Dog);      // Output: true
console.log(myDog instanceof Animal);   // Output: true
console.log(myDog instanceof Object);   // Output: true
console.log(myDog instanceof Array);    // Output: false

`isPrototypeOf()` முறை

Object.prototype.isPrototypeOf() முறை, மற்றொரு பொருளின் முன்மாதிரி சங்கிலியில் ஒரு பொருள் எங்காவது தோன்றுமா என சரிபார்க்கிறது.

console.log(Dog.prototype.isPrototypeOf(myDog));    // Output: true
console.log(Animal.prototype.isPrototypeOf(myDog)); // Output: true
console.log(Object.prototype.isPrototypeOf(myDog)); // Output: true

நிழல் பண்புகள்

ஒரு பொருளில் உள்ள ஒரு சொத்து அதன் முன்மாதிரியில் உள்ள ஒரு சொத்தை நிழல் என்று கூறப்படுகிறது, அது அதே பெயரைக் கொண்டிருந்தால். நீங்கள் சொத்தை அணுகும்போது, பொருளில் உள்ள ஒன்று பெறப்படுகிறது, மேலும் முன்மாதிரியில் உள்ள ஒன்று புறக்கணிக்கப்படுகிறது (பொருளின் சொத்து நீக்கப்படும் வரை). இது தரவு பண்புகள் மற்றும் முறைகள் இரண்டிற்கும் பொருந்தும்.

class Person {
  constructor(name) {
    this.name = name;
  }
  greet() {
    console.log(`Hello from Person: ${this.name}`);
  }
}

class Employee extends Person {
  constructor(name, id) {
    super(name);
    this.id = id;
  }

  // Shadowing the greet method from Person
  greet() {
    console.log(`Hello from Employee: ${this.name}, ID: ${this.id}`);
  }
}

const emp = new Employee("Jane", "E123");
emp.greet(); // Output: Hello from Employee: Jane, ID: E123

// To call the parent's greet method, we'd need super.greet()

முடிவுரை

JavaScript முன்மாதிரி சங்கிலி என்பது பொருள்கள் எவ்வாறு உருவாக்கப்படுகின்றன, பண்புகள் எவ்வாறு அணுகப்படுகின்றன மற்றும் மரபுரிமை எவ்வாறு அடையப்படுகிறது என்பதை அடிப்படையாகக் கொண்ட ஒரு அடிப்படை கருத்தாகும். ES6 வகுப்புகள் போன்ற நவீன தொடரியல் அதன் பயன்பாட்டை எளிதாக்கும்போது, எந்தவொரு தீவிர JavaScript டெவலப்பருக்கும் முன்மாதிரிகளைப் பற்றிய ஆழமான புரிதல் அவசியம். இந்தக் கருத்தில் தேர்ச்சி பெறுவதன் மூலம், அதிக திறமையான, மீண்டும் பயன்படுத்தக்கூடிய மற்றும் பராமரிக்கக்கூடிய குறியீட்டை எழுதும் திறனை நீங்கள் பெறுகிறீர்கள், இது உலகளாவிய திட்டங்களில் திறம்பட ஒத்துழைப்பதற்கு முக்கியமானது. நீங்கள் ஒரு பன்னாட்டு நிறுவனத்திற்காக அல்லது சர்வதேச பயனர் தளத்தைக் கொண்ட ஒரு சிறிய தொடக்க நிறுவனத்திற்காக உருவாக்குகிறீர்களா என்பதைப் பொறுத்து, JavaScript இன் முன்மாதிரி மரபுரிமையைப் பற்றிய ஒரு உறுதியான புரிதல் உங்கள் மேம்பாட்டுக் களஞ்சியத்தில் ஒரு சக்திவாய்ந்த கருவியாகச் செயல்படும்.

தொடர்ந்து ஆராயுங்கள், தொடர்ந்து கற்றுக்கொள்ளுங்கள், மகிழ்ச்சியான கோடிங்!